Cesium.Camera.DEFAULT_VIEW_RECTANGLE = Cesium.Rectangle.fromDegrees(
90,
-20,
110,
90
);

const viewer = new Cesium.Viewer("cesiumContainer", {
info: false,
geocoder: false,
homeButton: false,
sceneModePicker: false,
baseLayerPicker: false,
navigationHelpButton: false,
animation: false,
// creditContainer: "credit",
timeline: false,
fullscreenButton: false,
vrButton: false,
// terrain: Cesium.Terrain.fromWorldTerrain(),
imageryProvider: new Cesium.SingleTileImageryProvider({
    url: "",
}), //影像服务提供者必须创建
});
// 去除cesium的logo
viewer.cesiumWidget.creditContainer.style.display = "none";

// 将原来鼠标中键倾斜视图修改为鼠标左键拖动
viewer.scene.screenSpaceCameraController.tiltEventTypes = [
Cesium.CameraEventType.RIGHT_DRAG,
];
// 将原来鼠标右键拖动缩放修改为鼠标滚轮滚动
viewer.scene.screenSpaceCameraController.zoomEventTypes = [
Cesium.CameraEventType.WHEEL,
];

viewer.scene.globe.depthTestAgainstTerrain = true;


// 加载高德地图，高德地图存在坐标偏移问题。推荐使用天地图
var imgLayer = new Cesium.UrlTemplateImageryProvider({
url: "https://webst02.is.autonavi.com/appmaptile?style=6&x={x}&y={y}&z={z}",
minimumLevel: 3,
maximumLevel: 18,
});
viewer.imageryLayers.addImageryProvider(imgLayer);


const scene = viewer.scene;


let rectangle;

function createPrimitives(scene) {
    rectangle = scene.primitives.add(
        new Cesium.Primitive({
        geometryInstances: new Cesium.GeometryInstance({
            geometry: new Cesium.RectangleGeometry({
            rectangle: Cesium.Rectangle.fromDegrees(-120.0, 20.0, -60.0, 40.0),
            vertexFormat: Cesium.EllipsoidSurfaceAppearance.VERTEX_FORMAT,
            }),
        }),
        appearance: new Cesium.EllipsoidSurfaceAppearance({
            aboveGround: false,
            material:new Cesium.Material({
            fabric: {
                type: "Image",
                uniforms: {
                image: "../images/Cesium_Logo_Color.jpg",
                },
            },
            })
        }),

        }),
    );
}

// 动态切换图片候选列表
let imagePaths = [
    "../images/Image1.jpg",
    "../images/Image2.jpg",
    "../images/Image3.jpg",
    "../images/Image4.jpg",
    // Add more image paths as needed
];
let currentIndex = 0;

// 动态更换图片
function changeImageEverySecond(primitive, imageList) {
    function nextImage() {
        // Update the material with the next image in the list
        currentIndex = (currentIndex + 1) % imageList.length;
        updateImageMaterial(primitive, imageList[currentIndex]);

        // Schedule the next change
        setTimeout(nextImage, 1000); // Change every 1 second
    }

    // Start the first change immediately
    nextImage();
}

function updateImageMaterial(primitive, imagePath) {
    primitive.appearance.material = new Cesium.Material({
        fabric: {
            type: "Image",
            uniforms: {
                image: imagePath,
            },
        },
    });
}

// Assuming 'scene' and 'rectangle' are defined and available here.
createPrimitives(scene);
rectangle.show = true;

// Start changing images every second
changeImageEverySecond(rectangle, imagePaths);